紓壓APP第二彈??

Resource

在res>drawable-v24加入三張圖檔，分別是有地鼠、沒地鼠和地鼠被打到時
因為不會畫地鼠，所以先用貓咪代替了~

在res>layout加入一個Layout檔案，當作 GridView顯示的畫面

Layout

GridView

GridView和上一篇的Spinner一樣是清單元件，GridView會把內容排成方形，並用格狀的方式擺放，可以設定numColumms，決定顯示的列數

Method

建立一個IntArray，當作圖片放置的依據，當0時代表沒有地鼠，1代表有地鼠

//這邊將data設成全域變數
for (i in 0 until 9) {
    data[i] = 0
}

Adapter

這次使用自訂的Adapter，從File>New>File>Kotlin File/Class，新增一個Class，繼承BaseAdapter
因為會用到MainActivity中的方法，所以除了Layout檔案的路徑和前面設置的IntArray，還要傳入一個Context

class MyAdapter constructor(private val layout:Int,private val data: IntArray,val context:Context):BaseAdapter(){
}

有四個需要override的方法

• getCount()
  回傳資料數量
• getItem()
  回傳顯示的項目
• getItemId(p: Int)
  回傳顯示項目的id
• getView()
  回傳畫面

class MyAdapter constructor(private val layout:Int,private val data: IntArray,val context:Context):BaseAdapter() {
    //回傳資料數量
    override fun getCount() = data.size
    //回傳第p個項目
    override fun getItem(p: Int) = data[p]
    //回傳第p個項目的id
    override fun getItemId(p: Int) = 0L
    //取得畫面元件
    override fun getView(position: Int, converView: View?, parent: ViewGroup?): View {
    
        val view = View.inflate(parent?.context ,layout, null)
        //根據傳入的數字設置ImageView的圖片
        when(data[position]){
            0-> view.img.setImageResource(R.drawable.noGophers)
            else-> view.img.setImageResource(R.drawable.Gophers)
        }
        //對ImageView進行監聽
        view.img.setOnClickListener {
            //當ImageView室友地鼠的時候執行
            if(data[position] == 1){
                //addScore是MainActivity中設置的方法
                (context as MainActivity).addScore()
                //設成地鼠被打到時的圖片
                view.img.setImageResource(R.drawable.hit)
                //利用Thread延遲0.3秒 再換回原來的圖片
                Thread(Runnable {
                    Thread.sleep(300)
                    view.img.setImageResource(R.drawable.noGophers)
                }).start()
            }
        }
        //回傳畫面
        return view
    }
}

在MainActivity中設置Adapter，並設定numColumms，讓GridView在每個列顯示三個Item

gridView.numColumns = 3
gridView.adapter = MyAdapter(R.layout.item, data,this)

設置地鼠

//重設所有的位置
fun reset() {
    for (i in 0 until 9) {
        data[i] = 0
    }
}

fun newRound() {
    reset()
    //每次隨機出現2~4隻地鼠
    for (i in 0 until (Math.random() * 3).toInt()+2) {
    //在9個位置中隨機匴擇1個
    data[(Math.random() * 9).toInt()] = 1
    }
    //更新畫面
    gridView.adapter = MyAdapter(R.layout.item, data,this)
}

實作成果